<template>
	<view class="profile">
		<view class="profile-container">
			<view @click="amend()">修改呢称<text>></text></view>
			<view style="border: 0;" @click="amends()">修改性别<text>></text></view>
		</view>
		<uni-popup ref="popup" type="dialog">
			<uni-popup-message type="input" message="成功消息" :duration="2000" :before-close="true" @close="close" @confirm="confirm"></uni-popup-message>
		</uni-popup>
		<uni-popup ref="popups" type="dialog">
			<uni-popup-gender type="input" message="成功消息" :duration="2000" :before-close="true" @close="close" @confirms="confirms"></uni-popup-gender>
		</uni-popup>
	</view>
</template>

<script>
	import uniPopupMessage from '@/components/uni-popup/uni-popup-message.vue'
	import uniPopupGender from '@/components/uni-popup/uni-popup-gender.vue'
	export default {
		components: {
			uniPopupMessage,
			uniPopupGender
		},
		data() {
			return {
				addName: '',
				addNames: '',
				Token: ""
			}
		},
		onLoad() {
			this.Token = uni.getStorageSync('Token')
		},
		methods: {
			amend() {
				this.$refs.popup.open()
			},
			amends() {
				this.$refs.popups.open()
			},
			confirm(done) {
				console.log(done)
				uni.request({
					url: this.$C.webUrl + `m.api?_gp=user&_mt=syncUserInfo&nickName=${done}`,
					header: {
						'accessToken': this.Token
					},
					success:(res)=>{
						console.log(res)
						uni.setStorageSync('nickname',done);
					}
				})
			},
			confirms(dones) {
				this.addNames = dones
				console.log(this.addNames)
			},
			open() {
				this.$refs.popup
			},
			 close(done){
			            done()
			        },
		},
	}
</script>

<style>
	.profile {
		width: 100%;
		height: 100vh;
		background: #F8F8F8;
	}

	.profile-container {
		width: 100%;
		height: 170upx;
		background: #FFFFFF;
		font-size: 15px;
		color: #303133;
	}

	.profile-container view {
		width: 100%;
		height: 80upx;
		margin-left: 20upx;
		border-bottom: #CCCCCC solid 1upx;
	}

	.profile-container text {
		width: 50upx;
		height: 100upx;
		margin-left: 450upx;
		font-size: 24px;
		color: #606266;
	}
</style>
